<template>
  <div>
    <!-- //搜索框 -->
    <el-form :inline="true" :model="formInline" class="demo-form-inline" style="margin-bottom:30px">
      <div style="float:left" id="bigbox">
        <el-form-item label="员工姓名" style="float:left">
          <el-input v-model="formInline.empoyer" placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="联系方式" style="float:left">
          <el-input v-model="formInline.phone" placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="所属部门" style="float:left">
          <el-select v-model="formInline.depart" placeholder="请选择">
            <el-option label="财务部" value="money"></el-option>
            <el-option label="人事部" value="hr"></el-option>
            <el-option label="工程部" value="engineer"></el-option>
            <el-option label="预决算部" value="budget"></el-option>
            <el-option label="招采部" value="purchase"></el-option>
            <el-option label="总经办" value="direct"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="打卡日期" style="float:left">
          <el-col :span="20">
            <el-date-picker
              type="date"
              placeholder="请选择"
              v-model="formInline.date"
              style="width: 100%;"
            ></el-date-picker>
          </el-col>
        </el-form-item>

        <el-form-item style="float:left">
          <el-button type="primary" @click="onSubmit">查询</el-button>
          <el-button>重置</el-button>
        </el-form-item>
      </div>
      <el-button type="primary">EXCEL导出</el-button>
    </el-form>
    <!-- 表单 -->

    <!-- 分页 -->
    <el-pagination background layout="prev, pager, next" :total="15" style="margin-top:30px"></el-pagination>
  </div>
</template>

<script>
export default {
  data() {
    return {
      formInline: {
        empoyer: "",
        phone: "",
        depart: "",
        date: ""
      }
    };
  },
  methods: {
    handleClick(row) {
      console.log(row);
    },
    onSubmit() {
      console.log("submit!");
    }
  },
  created() {},
  mounted() {},
  computed: {}
};
</script>

<style scoped lang="less">
</style>